<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <!-- 避免IE使用兼容模式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>警告框</title>
    <script type="text/javascript" src="./../../../static/js/include/_include-css.js"></script>
</head>

<body class="bg-gray">
    <div class="wrapper">
        <div class="wrapper-container">
            <div class="row">
                <div class="col-md-6">
                    <div class="panel">
                        <div class="panel-heading">
                            基本警告框
                        </div>
                        <div class="panel-body">
                            <div class="alert alert-primary ">
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                            </div>
                            <div class="alert alert-success ">
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                            </div>
                            <div class="alert alert-info ">
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                            </div>
                            <div class="alert alert-warning ">
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                            </div>
                            <div class="alert alert-danger ">
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="panel">
                        <div class="panel-heading">
                            带链接的警告框
                        </div>
                        <div class="panel-body">
                            <div class="alert alert-primary ">
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                                <a class="alert-link" href="#">《黄鹤楼送孟浩然之广陵》</a>
                            </div>
                            <div class="alert alert-success ">
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                                <a class="alert-link" href="#">《黄鹤楼送孟浩然之广陵》</a>
                            </div>
                            <div class="alert alert-info ">
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                                <a class="alert-link" href="#">《黄鹤楼送孟浩然之广陵》</a>
                            </div>
                            <div class="alert alert-warning ">
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                                <a class="alert-link" href="#">《黄鹤楼送孟浩然之广陵》</a>
                            </div>
                            <div class="alert alert-danger ">
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                                <a class="alert-link" href="#">《黄鹤楼送孟浩然之广陵》</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="panel">
                        <div class="panel-heading">
                            可关闭的警告框
                        </div>
                        <div class="panel-body">
                            <div class="alert alert-primary alert-dismissable">
                                <button data-dismiss="alert" class="close" type="button">×</button>
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                                <a class="alert-link" href="#">查看更多</a>
                            </div>
                            <div class="alert alert-success alert-dismissable">
                                <button data-dismiss="alert" class="close" type="button">×</button>
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                                <a class="alert-link" href="#">查看更多</a>
                            </div>
                            <div class="alert alert-info alert-dismissable">
                                <button data-dismiss="alert" class="close" type="button">×</button>
                                唧唧复唧唧，木兰当户织。不闻机杼声，唯闻女叹息。问女何所思，问女何所忆。女亦无所思，女亦无所忆。昨夜见军帖，可汗大点兵，军书十二卷，卷卷有爷名。阿爷无大儿，木兰无长兄，愿为市鞍马，从此替爷征。东市买骏马，西市买鞍鞯...
                                <a class="alert-link" href="#">查看更多</a>
                            </div>
                            <div class="alert alert-warning alert-dismissable">
                                <button data-dismiss="alert" class="close" type="button">×</button>
                                唧唧复唧唧，木兰当户织。不闻机杼声，唯闻女叹息。问女何所思，问女何所忆。女亦无所思，女亦无所忆。昨夜见军帖，可汗大点兵，军书十二卷，卷卷有爷名。阿爷无大儿，木兰无长兄，愿为市鞍马，从此替爷征。东市买骏马，西市买鞍鞯...
                                <a class="alert-link" href="#">查看更多</a>
                            </div>
                            <div class="alert alert-danger alert-dismissable">
                                <button data-dismiss="alert" class="close" type="button">×</button>
                                唧唧复唧唧，木兰当户织。不闻机杼声，唯闻女叹息。问女何所思，问女何所忆。女亦无所思，女亦无所忆。昨夜见军帖，可汗大点兵，军书十二卷，卷卷有爷名。阿爷无大儿，木兰无长兄，愿为市鞍马，从此替爷征。东市买骏马，西市买鞍鞯...
                                <a class="alert-link" href="#">查看更多</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="panel">
                        <div class="panel-heading">
                            深色警告框
                        </div>
                        <div class="panel-body">
                            <div class="alert alert-primary alert-dismissable dark">
                                <button data-dismiss="alert" class="close" type="button">×</button>
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                                <a class="alert-link" href="#">查看更多</a>
                            </div>
                            <div class="alert alert-success alert-dismissable dark">
                                <button data-dismiss="alert" class="close" type="button">×</button>
                                故人西辞黄鹤楼，烟花三月下扬州。孤帆远影碧空尽，唯见长江天际流。
                                <a class="alert-link" href="#">查看更多</a>
                            </div>
                            <div class="alert alert-info alert-dismissable dark">
                                <button data-dismiss="alert" class="close" type="button">×</button>
                                唧唧复唧唧，木兰当户织。不闻机杼声，唯闻女叹息。问女何所思，问女何所忆。女亦无所思，女亦无所忆。昨夜见军帖，可汗大点兵，军书十二卷，卷卷有爷名。阿爷无大儿，木兰无长兄，愿为市鞍马，从此替爷征。东市买骏马，西市买鞍鞯...
                                <a class="alert-link" href="#">查看更多</a>
                            </div>
                            <div class="alert alert-warning alert-dismissable dark">
                                <button data-dismiss="alert" class="close" type="button">×</button>
                                唧唧复唧唧，木兰当户织。不闻机杼声，唯闻女叹息。问女何所思，问女何所忆。女亦无所思，女亦无所忆。昨夜见军帖，可汗大点兵，军书十二卷，卷卷有爷名。阿爷无大儿，木兰无长兄，愿为市鞍马，从此替爷征。东市买骏马，西市买鞍鞯...
                                <a class="alert-link" href="#">查看更多</a>
                            </div>
                            <div class="alert alert-danger alert-dismissable dark">
                                <button data-dismiss="alert" class="close" type="button">×</button>
                                唧唧复唧唧，木兰当户织。不闻机杼声，唯闻女叹息。问女何所思，问女何所忆。女亦无所思，女亦无所忆。昨夜见军帖，可汗大点兵，军书十二卷，卷卷有爷名。阿爷无大儿，木兰无长兄，愿为市鞍马，从此替爷征。东市买骏马，西市买鞍鞯...
                                <a class="alert-link" href="#">查看更多</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="./../../../static/js/include/_include-js.js"></script>
</body>

</html>